<template>
  <div>
    <k-search show-export @export="onExport">
      <el-input placeholder="输入姓名、公司名称搜索"
                size="small"
                v-model="search.key"
                @keyup.enter.native="onClickSearch"
                style="width: 400px"/>

      <k-search-box label="性别">
        <el-select size="small" v-model="search.status" style="width: 100px">
          <el-option :value="0" label="未处理"/>
          <el-option :value="1" label="已处理"/>
        </el-select>
      </k-search-box>

      <k-search-box>
        <el-button type="info" size="small"
                   @click="onClickSearch"
                   icon="el-icon-search">搜索</el-button>
      </k-search-box>
    </k-search>


    <div class="ke__bgfff">
      <el-table :data="showlist" v-loading="loading" size="small">
        <el-table-column prop="user.realname" label="姓名"/>

        <el-table-column prop="position_name" label="职位名称"/>

        <el-table-column prop="company_name" label="公司名称"/>

        <el-table-column prop="money" label="薪资">
          <template slot-scope="{ row }">
            {{ row.money_min }}-{{ row.money_max }}K
          </template>
        </el-table-column>

        <el-table-column prop="exp_name" label="经验"/>

        <el-table-column prop="edu_name" label="学历要求"/>

        <el-table-column prop="create_time" label="投递时间" width="200"/>

        <el-table-column label="状态" width="100" align="center">
          <template slot-scope="{ row }">
            <el-tag v-show="row.status === 0">
              未处理
            </el-tag>
            <el-tag v-show="row.status === 1" type="info">
              已处理
            </el-tag>
          </template>
        </el-table-column>

        <el-table-column label="操作" width="200" align="center">
          <template slot-scope="{ row, $index }">
            <el-button v-show="row.status === 0"
                       type="warning"
                       size="small"
                       @click="onClickHandle(row, $index)">设为已处理</el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-pagination :current-page="page"
                     :total="total"
                     :page-size="limit"
                     @current-change="onPageChange"/>
    </div>
  </div>
</template>

<script>
  import KSearch from '@/components/KSearch'
  import KSearchBox from '@/components/KSearchBox'
  export default {
    name: 'ZhaopinMessage',
    components: { KSearchBox, KSearch },
    data () {
      return {
        list: [],
        total: 0,
        loading: true,
        page: 1,
        limit: 20,
        search: {
          key: '',
          status: 0
        },
        editDialog: false,
      }
    },
    computed: {
      showlist () {
        return this.list.map(item => {
          item.edu_name = item.edu?.name || '不限'
          item.exp_name = item.expe?.name || '不限'
          return item
        })
      }
    },
    mounted () {
      this.onLoad()
    },
    methods: {
      onClickSearch () {
        this.page = 1
        this.onLoad()
      },
      onPageChange (page) {
        this.list = []
        this.page = page
        this.onLoad()
      },
      // 加载列表
      onLoad () {
        this.loading = true
        this.$http.get('admin/zhaopin/message', { page: this.page, limit: this.limit, ...this.search })
          .finally(() => this.loading = false)
          .then(result => {
            this.list = result.list
            this.total = result.total
          })
      },

      // 导出表格
      onExport () {
        this.$http.post('admin/export/zhaopin_message')
          .then(result => {
            if (result.res_code === 0) {
              this.$message.success('导出成功')
              setTimeout(() => {
                this.$router.push({ name: 'export' })
              }, 500)
            } else {
              this.$message.error(result.res_msg)
            }
          })
      },
      /**
       * 处理状态
       */
      async onClickHandle (item, idx) {
        await this.$confirm('确定修改为已处理状态吗?')
        this.$http.patch(`admin/zhaopin/message/${item.id}`)
          .then(result => {
            if (result.res_code === 0) {
              this.$message.success('处理成功')
              KE.array.update(this.list, item.id, {
                status: 1
              })
            } else {
              this.$message.error(result.res_msg)
            }
          })
      }
    }
  }
</script>

<style scoped lang="scss">

</style>
